import React, {Component} from 'react';
import BetterScroll from 'better-scroll'

class App
    extends Component {
    state={
        list:['1111','2222','3333','4444','5555','6666','7777','8888','9999','0000','1213','2324','3435','1111','2222','3333','4444','5555','6666','7777','8888','9999','0000','1213','2324','3435',]
    }

    componentWillMount() {
        console.log(document.querySelectorAll('li'))
    }

    componentDidMount() {
        new BetterScroll('#wrapper')
    }

    render() {
        return (
            <div>
                <div id="wrapper" style={{
                    height:'200px',
                    background:'yellow',
                    overflow: 'hidden',
                }}>
                    <ul>
                        {
                            this.state.list.map(item=>
                            <li key={item}>{item}</li>
                            )
                        }
                    </ul>
                </div>
            </div>
        );
    }
}

export default App;
